<template>
  <div class="wrap">
    <div class="mb-8 flex justify-between header p-4">
      <h1>
        <slot name="title"></slot>
      </h1>
      <div>
        <CloseOutlined @click="goHome" class="text-18px" />
      </div>
    </div>
    <slot></slot>
  </div>
</template>

<script setup lang="ts">
import router from '@/router';
import { CloseOutlined } from '@ant-design/icons-vue';

const goHome = () => {
  router.push('/');
};
</script>

<style lang="scss" scoped>
.header {
  @apply p-8;
}
</style>
